<template>
	<div>
		<!-- 面包屑导航 -->
		<el-breadcrumb separator-class="el-icon-arrow-right">
				<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
				<el-breadcrumb-item>账号管理</el-breadcrumb-item>
				<el-breadcrumb-item>商户登录账号</el-breadcrumb-item>
		</el-breadcrumb>
		
		<div class="whole-flex-center-between whole-top-handle">
			<div class="">
				<el-input class="input-w" size="small" v-model="account" placeholder="登录账号" clearable>
				</el-input>
				<el-button size="small" @click="getinfo(account)">查询</el-button>
			</div>
		</div>
		<el-table :data="tableData" style="width: 100%">
			<el-table-column prop="id" label="id" width="80">
			</el-table-column>
			<el-table-column prop="users.user_name" label="账户名">
			</el-table-column>
			<el-table-column prop="users.nick_name" label="账户简称">
			</el-table-column>
			<el-table-column prop="account" label="账号">
			</el-table-column>
			<el-table-column align="center" label="操作">
				<template slot-scope="scope">
					<el-button size="mini" @click="aa(scope.row)">按钮</el-button>
				</template>
			</el-table-column>
		</el-table>
		<div class="whole-pagination">
			<el-pagination background layout="prev, pager, next" :page-size="size" :total="count"
				@current-change="currentPage"></el-pagination>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				account: '',
				tableData: [],
				count: 0,
				size: 10,
				page: 1,
			}
		},
		created() {
			this.accountls(this.page);
		},
		methods: {
			accountls(page) {
				let that = this;
				if (that.$store.state.rule == 3) { //超级管理
					this.$axios({
						url: "/admin/master/account",
						data: {
							offset: page,
							limit: that.size,
							rule: 1
						},
						success(res) {
							if (res.data.code == 200) {
								that.tableData = res.data.content.data
								that.count = res.data.content.count
							}
						},
					});
				}
			},
			currentPage(page) {
				this.accountls(page);
			},
			getinfo(){
				let that = this;
				this.$axios({
					url: "/admin/master/account",
					data: {
						offset: that.page,
						limit: that.size,
						rule: 1,
						account: that.account,
					},
					success(res) {
						if (res.data.code == 200) {
							that.tableData = res.data.content.data
							console.log(that.tableData)
						}
					},
				});
			}
		}
	}
</script>
<style scoped>
	.input-w {
		width: 200px;
		margin: 0 5px 5px 0;
	}
</style>
